<template>
	 <div style="display: flex;justify-content: center;align-items: center;flex-direction: row;">
   		<ul style="width: 50%;font-size: 0.9rem;">
   			<li style="height: 1.4rem;background: seashell;border-bottom: 1px solid ghostwhite;text-align: center;" v-for="(item,index) in aArr" @click="moveEle(index)">{{item}}</li>
   		</ul>
   		<ul style="width: 50%;font-size: 0.9rem;">
   			<li style="height: 1.4rem;background: seashell;border-bottom: 1px solid ghostwhite;text-align: center;" v-for="item in bArr">{{item}}</li>
   		</ul>
   </div>
</template>

<script>
	export default {
	  data(){
	    return {
	    	aArr:[0,1,2,3,4],
      		bArr:[]
	    }
	  },
	  methods:{
		  	moveEle(data){
		  		this.bArr.push(this.aArr[data])
		  		this.aArr.splice(data,1)
		  		console.info(this.aArr)
		  		console.info(this.bArr)
	  		},
	  }
 }
</script>

<style>
</style>